import React, { useState } from 'react';
import { DownOutlined } from '@ant-design/icons';
import { Dropdown, Space } from 'antd';
import { useNavigate, Link } from 'react-router-dom';
import gb from '../../static/bootstrap/images/gb.svg';
import us from '../../static/bootstrap/images/us.svg';
import user3 from '../../static/bootstrap/images/user3.png';
function Head({ address }) {

    const [open1, setOpen1] = useState(false);
    const [open2, setOpen2] = useState(false);
    const navigate = useNavigate();





    return (

        <div className="app-header d-flex align-items-center">
            <div className="d-flex">
                <button
                    className="btn btn-outline-light toggle-sidebar"
                    id="toggle-sidebar"
                >
                    <i className="icon-menu" />
                </button>
                <button
                    className="btn btn-outline-light pin-sidebar"
                    id="pin-sidebar"
                >
                    <i className="icon-menu" />
                </button>
            </div>
            <div className="search-container d-sm-block d-none mx-3">
                <input
                    className="form-control"
                    placeholder="Search"
                    type="text"
                />
                <i className="icon-search" />
            </div>
            <div className="header-actions">
                <div className="dropdown">
                    <a
                        aria-expanded="false"
                        className="dropdown-toggle d-flex p-3 position-relative"
                        data-bs-toggle="dropdown"
                        href="#!"
                        role="button"
                    >
                        <img
                            alt="Great Britain"
                            className="flag-img"
                            src={gb}
                        />
                    </a>
                    <div className="dropdown-menu dropdown-menu-end shadow-sm dropdown-menu-mini">
                        <div className="country-container">
                            <a
                                className="py-2"
                                href=""
                            >
                                <img
                                    alt="USA"
                                    src={us}
                                />
                            </a>
                            <a
                                className="py-2"
                                href=""
                            >
                                <img
                                    alt="India"
                                    src="assets/images/in.svg"
                                />
                            </a>
                            <a
                                className="py-2"
                                href=""
                            >
                                <img
                                    alt="Brazil"
                                    src="assets/images/br.svg"
                                />
                            </a>
                            <a
                                className="py-2"
                                href=""
                            >
                                <img
                                    alt="Turkey"
                                    src="assets/images/tr.svg"
                                />
                            </a>
                            <a
                                className="py-2"
                                href=""
                            >
                                <img
                                    alt="Indonesia"
                                    src="assets/images/id.svg"
                                />
                            </a>
                        </div>
                    </div>
                </div>
                <div className="dropdown">
                    <a
                        aria-expanded="false"
                        className="dropdown-toggle d-flex p-3 position-relative"
                        data-bs-toggle="dropdown"
                        href="#!"
                        role="button"
                    >
                        <i className="icon-mail fs-4 lh-1" />
                        <span className="count rounded-circle bg-danger">
                            9
                        </span>
                    </a>
                    <div className="dropdown-menu dropdown-menu-end dropdown-menu-md shadow-sm">
                        <h5 className="fw-semibold px-3 py-2 m-0">
                            Messages
                        </h5>
                        <a
                            className="dropdown-item"
                            href="#"
                        >
                            <div className="d-flex align-items-start py-2">
                                <div className="p-3 bg-danger rounded-circle me-3">
                                    MS
                                </div>
                                <div className="m-0">
                                    <h6 className="mb-1 fw-semibold">
                                        Moory Sammy
                                    </h6>
                                    <p className="mb-1">
                                        Sent a mail.
                                    </p>
                                    <p className="small m-0 opacity-50">
                                        3 Mins Ago
                                    </p>
                                </div>
                            </div>
                        </a>
                        <a
                            className="dropdown-item"
                            href="#"
                        >
                            <div className="d-flex align-items-start py-2">
                                <div className="p-3 bg-primary rounded-circle me-3">
                                    KY
                                </div>
                                <div className="m-0">
                                    <h6 className="mb-1 fw-semibold">
                                        Kyle Yomaha
                                    </h6>
                                    <p className="mb-1">
                                        Need support.
                                    </p>
                                    <p className="small m-0 opacity-50">
                                        5 Mins Ago
                                    </p>
                                </div>
                            </div>
                        </a>
                        <a
                            className="dropdown-item"
                            href="#"
                        >
                            <div className="d-flex align-items-start py-2">
                                <div className="p-3 bg-success rounded-circle me-3">
                                    SB
                                </div>
                                <div className="m-0">
                                    <h6 className="mb-1 fw-semibold">
                                        Srinu Basava
                                    </h6>
                                    <p className="mb-1">
                                        Purchased a NotePad.
                                    </p>
                                    <p className="small m-0 opacity-50">
                                        7 Mins Ago
                                    </p>
                                </div>
                            </div>
                        </a>
                        <div className="d-grid p-3 border-top">
                            <a
                                className="btn btn-outline-primary"
                                href="#"
                            >
                                View all
                            </a>
                        </div>
                    </div>
                </div>
                <div className="dropdown">
                    <a
                        aria-expanded="false"
                        className="dropdown-toggle d-flex p-3 position-relative"
                        data-bs-toggle="dropdown"
                        href="#!"
                        role="button"
                    >
                        <i className="icon-twitch fs-4 lh-1" />
                        <span className="count rounded-circle bg-danger">
                            5
                        </span>
                    </a>
                    <div className="dropdown-menu dropdown-menu-end dropdown-menu-md shadow-sm">
                        <h5 className="fw-semibold px-3 py-2 m-0">
                            Notifications
                        </h5>
                        <a
                            className="dropdown-item"
                            href="#"
                        >
                            <div className="d-flex align-items-start py-2">
                                <img
                                    alt="Admin Themes"
                                    className="img-3x me-3 rounded-3"
                                    src="assets/images/user.png"
                                />
                                <div className="m-0">
                                    <h6 className="mb-1 fw-semibold">
                                        Sophie Michiels
                                    </h6>
                                    <p className="mb-1">
                                        Membership has been ended.
                                    </p>
                                    <p className="small m-0 opacity-50">
                                        Oct 20, 07:30pm
                                    </p>
                                </div>
                            </div>
                        </a>
                        <a
                            className="dropdown-item"
                            href="#"
                        >
                            <div className="d-flex align-items-start py-2">
                                <img
                                    alt="Admin Theme"
                                    className="img-3x me-3 rounded-3"
                                    src="assets/images/user2.png"
                                />
                                <div className="m-0">
                                    <h6 className="mb-1 fw-semibold">
                                        Sophie Michiels
                                    </h6>
                                    <p className="mb-1">
                                        Congratulate, James for new job.
                                    </p>
                                    <p className="small m-0 opacity-50">
                                        Oct 24, 08:00pm
                                    </p>
                                </div>
                            </div>
                        </a>
                        <a
                            className="dropdown-item"
                            href="#"
                        >
                            <div className="d-flex align-items-start py-2">
                                <img
                                    alt="Admin Theme"
                                    className="img-3x me-3 rounded-3"
                                    src="assets/images/user1.png"
                                />
                                <div className="m-0">
                                    <h6 className="mb-1 fw-semibold">
                                        Sophie Michiels
                                    </h6>
                                    <p className="mb-1">
                                        Lewis added new schedule release.
                                    </p>
                                    <p className="small m-0 opacity-50">
                                        Oct 28, 09:30pm
                                    </p>
                                </div>
                            </div>
                        </a>
                        <div className="d-grid p-3 border-top">
                            <a
                                className="btn btn-outline-primary"
                                href="#"
                            >
                                View all
                            </a>
                        </div>
                    </div>
                </div>
                <div className="dropdown ms-2">
                    <a
                        aria-expanded="false"
                        className="dropdown-toggle d-flex align-items-center user-settings"
                        data-bs-toggle="dropdown"
                        href="#!"
                        role="button"
                    >
                        <span>
                            吴佳伟
                        </span>
                        <img
                            alt="Bootstrap Gallery"
                            className="img-3x m-2 me-0 rounded-3"
                            src={user3}
                        />
                    </a>
                    <div className="dropdown-menu dropdown-menu-end dropdown-menu-sm shadow-sm gap-3">
                        <a
                            className="dropdown-item d-flex align-items-center py-2"
                            href="#"
                        >
                            <i className="icon-gitlab fs-4 me-3" />
                            User Profile
                        </a>
                        <a
                            className="dropdown-item d-flex align-items-center py-2"
                            href="account-settings.html"
                        >
                            <i className="icon-settings fs-4 me-3" />
                            Account Settings
                        </a>
                        <Link
                            className="dropdown-item d-flex align-items-center py-2"
                            to="/"
                        >
                            <i className="icon-log-out fs-4 me-3" />
                            Logout
                        </Link>
                    </div>
                </div>
            </div>
        </div>
    );
}

export default Head;